<template>
	<view class="content">
		<view class="list">
			<image :src="currentImage.src" style="width: 100vw;" @tap="todetail(currentImage)"></image>
		</view>
		<view class="shijian"  style="display: flex;flex-direction: row;justify-content: center;align-items: center;margin: 10px;font-size: 20px;" >
			<text>{{item_text}}</text>
		</view>
		<!--        <jade-image-preview v-if="preview" :id="img_id" :data="preData" @click="preview = false">
        </jade-image-preview> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				all_list: [],
				currentImageIndex: 0,
				currentImage: {},
				preview: false,
				img_id: '',
				preData: {},
				item_text: ''
			}
		},
		onLoad() {
			this.get_all_url();
		},
		methods: {
			get_all_url() {
				// 获取当前日期时间
				const currentDate = new Date();
				const year = currentDate.getFullYear().toString();
				let month = (currentDate.getMonth() + 1).toString().padStart(2, '0'); // 月份从0开始，需要加1，并且保证两位数格式
				let day = currentDate.getDate().toString().padStart(2, '0'); // 日期需要保证两位数格式

				// 构建日期部分URL
				const dateUrl = year + month + day;

				uni.request({
					
					url: 'https://data.cma.cn/weatherGis/web/bmd/VisDataDef/getVisData',
					method: 'GET',
					data: {
						// d_datetime: dateUrl,
						datacode: '1kmCLDAS_ChnPre01'
					},
					success: res => {
						this.all_list = res.data.data;
						this.updateImage();
						// 设置定时器，每1秒更新一次图片
						setInterval(() => {
							this.updateImage();
						}, 2000);
					},
					fail: () => {},
					complete: () => {}
				});
			},
			updateImage() {
				if (this.all_list.length === 0) return;

				this.currentImageIndex = (this.currentImageIndex + 1) % this.all_list.length;
				this.currentImage = {
					id: this.all_list[this.currentImageIndex].id,
					src: this.all_list[this.currentImageIndex].fileURL
				};
				this.item_text = this.get_data(this.all_list[this.currentImageIndex].c_FNAME)
			},
			get_data(filename) {
				console.log(filename);
				const regex = /(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/;
				const matches = filename.match(regex);

				if (matches) {
					const year = matches[1];
					const month = matches[2];
					const day = matches[3];
					const hour = matches[4];
					const minute = matches[5];
					const second = matches[6];
					return `年份: ${year}, 月份: ${month}, 日: ${day}, 小时: ${hour}`;

				} else {
					return '';
				}
			},
			todetail(item) {
				this.img_id = item.id;
				this.preview = true;
			}
		}
	}
</script>

<style>
	.list {
		display: flex;
		justify-content: center;
	}

	.image {
		margin-top: 20rpx;
		width: 500rpx;
	}
</style>